<html>

<head>
    <link rel="stylesheet" href="../normalize.css">
    <link rel="stylesheet" href="../index.css">
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>

<body>
    <div id="components-demo">
        <alert-box>
            Something bad happened.
        </alert-box>
    </div>
</body>

<script type="text/javascript">
    Vue.component('alert-box', {
        template: `
    <div class="demo-alert-box">
      <strong>Error!</strong>
      <slot></slot>
    </div>
  `
    })

    new Vue({
        el: '#components-demo'
    },
    );
</script>

</html>